@glimmer/validator

What is @glimmer/validator?

@glimmer/validator is a package used in the Glimmer.js ecosystem to provide reactive state management and validation. It allows developers to create reactive properties and track changes to them, ensuring that the UI stays in sync with the underlying data model.

What are @glimmer/validator's main functionalities?

Tracking Changes

This feature allows you to track changes to properties. When a tracked property changes, any dependent properties or computations are automatically updated.

const { tracked } = require('@glimmer/validator');

class Person {
  @tracked firstName;
  @tracked lastName;

  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  get fullName() {
    return `${this.firstName} ${this.lastName}`;
  }
}

let person = new Person('John', 'Doe');
console.log(person.fullName); // John Doe
person.firstName = 'Jane';
console.log(person.fullName); // Jane Doe

Validation

This feature allows you to validate properties using custom logic. The `@validate` decorator can be used to create computed properties that validate the state of other properties.

const { tracked, validate } = require('@glimmer/validator');

class User {
  @tracked email;

  constructor(email) {
    this.email = email;
  }

  @validate
  get isValidEmail() {
    return /^[^@]+@[^@]+\.[^@]+$/.test(this.email);
  }
}

let user = new User('[e-mail]');
console.log(user.isValidEmail); // true
user.email = 'invalid-email';
console.log(user.isValidEmail); // false

Other packages similar to @glimmer/validator

mobx

MobX is a state management library that makes it simple to connect the reactive data of your application with the UI. It provides similar reactive state management capabilities as @glimmer/validator but is more widely used and has a larger community.

vue

Vue.js is a progressive JavaScript framework for building user interfaces. It includes a reactivity system that is similar to @glimmer/validator's tracking and validation features. Vue's reactivity system is more integrated into the framework, providing a more comprehensive solution for building reactive applications.

redux

Redux is a predictable state container for JavaScript apps. While it does not provide the same automatic reactivity as @glimmer/validator, it offers a robust way to manage application state and can be combined with libraries like React to achieve similar reactive behavior.

README

The README file is missing

Changelog

v0.86.0 (2023-12-20)

:rocket: Enhancement

• @glimmer/debug, @glimmer/runtime, @glimmer/util
  • #1518 [perf] avoid double memory usage in append opcodes (@lifeart)
• @glimmer/validator
  • #1520 [perf] replace Math.max usage with reduce and pure compare (@lifeart)
  • #1522 [memory] replace forEach with arrayFrom (@lifeart)
• @glimmer/runtime
  • #1510 [perf | trim] Remove extra class (@lifeart)

:bug: Bug Fix

• @glimmer/runtime
  • #1440 Fix helper/modifier memory leak (@bendemboski)
• @glimmer/debug, @glimmer/destroyable
  • #1516 fix exports config for @glimmer/destroyable and @glimmer/debug (@NullVoxPopuli)

:house: Internal

• @glimmer-workspace/build
  • #1530 Upgrade to vite 5 (@NullVoxPopuli)
  • #1495 make it run on windows (@patricklx)
• Other
  • #1523 Restore a working linking setup (@chancancode)
  • #1497 Create codemods and opcode generator (@NullVoxPopuli)
• @glimmer-workspace/benchmark-env, @glimmer-workspace/build, @glimmer-workspace/integration-tests, @glimmer-workspace/test-utils, @glimmer/compiler, @glimmer/debug, @glimmer/destroyable, @glimmer/encoder, @glimmer/global-context, @glimmer/interfaces, @glimmer/local-debug-flags, @glimmer/manager, @glimmer/node, @glimmer/opcode-compiler, @glimmer/owner, @glimmer/program, @glimmer/reference, @glimmer/runtime, @glimmer/syntax, @glimmer/util, @glimmer/validator, @glimmer/vm-babel-plugins, @glimmer/vm, @glimmer/wire-format
  • #1506 Sort package.json files to reduce diff from the Error Recovery PR (@NullVoxPopuli)
• @glimmer/reference
  • #1483 Use stricter type for createPrimitiveRef (@NullVoxPopuli)

Committers: 5

• Alex Kanunnikov (@lifeart)
• Ben Demboski (@bendemboski)
• Godfrey Chan (@chancancode)
• Patrick Pircher (@patricklx)
• @NullVoxPopuli